<template>
    <div>
        <div class="notfound-view" :style="{'height': client.height + 'px'}">
            <div class="notfound-block">
                <h1 class="notfound-title">
                    {{ title }}
                </h1>
                <p class="notfound-text">去<router-link to="/">首页</router-link></p>
            </div>
        </div>
    </div>
</template>
<script>
    export default {
        name: 'pageNotFound',
        data() {
            return {
                title: '页面跑到火星去了',
            };
        }
    };
</script>
<style lang="scss" scoped>
    .notfound-view {
        position: relative;
        overflow: hidden;
        .notfound-block {
            position: absolute;
            width: 100%;
            top: 50%;
            margin-top: -100px;
            text-align: center;
            .notfound-title {
                font-size: 16px;
                line-height: 20px;
                color: #999;
                img {
                    height: 60px;
                    width: 60px;
                }
            }
            .notfound-text {
                color: #666;
                margin-top: 10px;
                font-size: 14px;
            }
        }
    }
</style>
